<template>
  <Input :value="value.toString()" icon="md-document" @on-click="start" @input="change"/>
</template>
<script>
/**
 * 选择文件夹
 */
import {remote, shell} from 'electron'

export default {
  name: 'v-file',
  props: {
    value: {
      type: [String, Object, Array],
      default: ''
    },
    extensions: {
      type:String,
      default: '*'
    },
    multiselectable: {
      type:Boolean,
      default: false
    }
  },
  data() {
    return {
      status: 0
    }
  },
  methods: {
    start() {
      if (this.status === 1) {
        return
      }
      this.status = 1
      let config = {
        defaultPath: this.value || '',
        properties: ['promptToCreate'],
        filters: [
          {
            name: 'All',
            extensions: [this.extensions]
          }
        ]
      }
      if (this.multiselectable) {
        config.properties.push('multiSelections')
      }
      if (typeof this.value !== 'string') {
        config.defaultPath = this.value[0]
      }
      remote.dialog.showOpenDialog(config, (res) => {
        this.status = 0
        if (res) {
          if (this.multiselectable === true) {
            this.$emit('input', res)
          } else {
            this.$emit('input', res[0])
          }
        }
      })
    },
    change (e) {
      this.$emit('input', e)
    },
    open() {
      shell.openExternal(this.value)
    }
  }
}
</script>